
<template>
  <div>
    <div class="row-header">
      <el-form ref="searchForm" :model="searchForm" label-width="50px" :inline="true">
        <el-form-item label=" " prop="realnameName">
          <el-input size="small" v-model="searchForm.realnameName" style="width: 300px;" clearable placeholder="请输入实名通道名称"></el-input>
        </el-form-item>
        <el-form-item label=" " prop="realNameCheckId">
          <el-select placeholder="请选择实名模板" style="width: 300px;" clearable v-model="searchForm.realNameCheckId">
            <el-option v-for="item in dictTypeOptions" :value="item.id" :label="item.checkName" :key="item.id"></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label=" " label-width="80px" prop="dictOrder">
          <el-select size="small" placeholder="请选择执行顺序" style="width: 300px;" clearable v-model="searchForm.dictOrder">
            <el-option v-for="item in dictOrderOptions" :value="item.id" :label="item.name" :key="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label=" " prop="dictIsAutoPass">
          <el-select placeholder="请选择是否自动通过" style="width: 300px" clearable v-model="searchForm.dictIsAutoPass">
            <el-option v-for="item in dictIsAutoPassOptions" :value="item.id" :label="item.name" :key="item.id"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div class="row-form-btn">
        <el-button type="shenda" size="mini" icon="el-icon-search" @click="beforeinitData">查询</el-button>
        <el-button size="mini" type="shenda"   icon="el-icon-refresh-right" @click="resetForm('searchForm')">重置</el-button>
      </div>
    </div>
    <div class="sd-page-line"></div>
    <div class="row-main">
      <el-button type="shenda" size="mini"   @click="initData"><i class="el-icon-refresh"></i>刷新数据</el-button>
      <el-button type="shenda" size="mini"   icon="el-icon-plus" @click="addNewNotice">新增实名</el-button>
      <el-table
        :data="tableData" align="center"  ref="formData" class="row-main-table" :header-cell-style="{ 'background':$store.state.app.tableBgColor,'color':'#606266' }"
        v-loading.fullscreen="mainTableLoading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.2)"
      >
        <el-table-column prop="realnameName" align='center' label="通道名称"></el-table-column>
        <el-table-column prop="dictTypeName" align='center' label="实名模板"></el-table-column>
        <el-table-column prop="dictDisplayCheckName" align='center' label="充值前强制校验"></el-table-column>
        <el-table-column prop="dictOrderName" align='center' label="执行顺序"></el-table-column>
        <el-table-column prop="dictRechargeButtonName" align='center' label="是否显示重试按钮"></el-table-column>
        <el-table-column prop="dictIsAutoPassName" align='center' label="是否自动通过"></el-table-column>
        <el-table-column align='center' label="操作">
          <template v-slot="{ row, rowIndex }">
            <el-dropdown trigger="click">
              <div>
                <svg-icon class="el-dropdown-link" icon-class="operation"></svg-icon>
              </div>
              <el-dropdown-menu slot="dropdown">
                <el-button class="operation" style="width: 100%;" @click="editEvent(row)" v-has="'editBaseInfo'">编辑
                </el-button>
                <el-button class="operation" style="width: 100%;" @click="deleteNoticeConfirm(row)" v-has="'openOrClose'">
                  删除
                </el-button>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
      </el-table>
      <div :style="{'overflow':$store.state.app.screenWidth<992?'scroll':'auto'}">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          class="row-main-pager"
          :current-page.sync="page.current"
          :page-size="page.size"
          :total="page.total"
          layout="total, sizes, prev, pager, next, jumper"
          background></el-pagination>
      </div>
    </div>

    <el-dialog
      class="delete"
      top="33vh"
      :visible.sync="deleteNoticeVisible"
      :append-to-body="true"
      width="30%"
    >
      <span style="display: flex; justify-content: center;">确定删除【<span v-text="deleteRow.realnameName"
                                                                       class="click_text"></span>】实名通道</span>
      <span class="dialog-footer" slot="footer">
        <el-button @click="deleteNoticeVisible = false" size="small">取 消</el-button>
        <el-button type="primary" @click="deleteNoticeFunc()" size="small">确 定</el-button>
      </span>
    </el-dialog>
    <el-drawer
      class="drawer_form"
      size="80%"
      :title="noticeTitle"
      :visible.sync="drawer"
      direction="ttb"
    >
      <div class="sd-drawer-content notice_drawer_form custom_drawer_content">
        <div class="sd-drawer-content-pannel">
          <el-form ref="saveInfo" :model="saveInfo" :rules="formRules">
            <el-row>
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                <el-form-item label="通道名称:" label-width="120px" prop="realnameName">
                  <el-input
                    size="small"
                    v-model="saveInfo.realnameName"
                    placeholder="请输入通道名称"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                <el-form-item label="实名模板:" label-width="120px" prop="realNameCheckId">
                  <el-select
                    size="small"
                    placeholder="实名模板"
                    style="width: 100%;"
                    v-model="saveInfo.realNameCheckId"
                    @change="event=>selectAccountTemplate(event)"
                  >
                    <el-option v-for="item in dictTypeOptions" :value="item.id" :label="item.checkName"
                               :key="item.id"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                <el-form-item label="充值前强制校验:" label-width="120px" prop="dictDisplayCheck">
                  <el-select
                    size="small"
                    placeholder="充值前强制校验"
                    style="width: 100%;"
                    v-model="saveInfo.dictDisplayCheck"
                  >
                    <el-option  value="C_YES" label="是"
                               key="C_YES"></el-option>
                    <el-option  value="C_NO" label="否"
                    key="C_NO"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row v-if="saveInfo.realNameCheckId==1||saveInfo.realNameCheckId==9||saveInfo.realNameCheckId==15||saveInfo.realNameCheckId==17||saveInfo.realNameCheckId==19">
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                <el-form-item label="执行顺序:" label-width="120px" prop="dictOrder">
                  <el-select
                    size="small"
                    placeholder="执行顺序"
                    style="width: 100%;"
                    v-model="saveInfo.dictOrder"
                  >
                    <el-option v-for="item in dictOrderOptions" :value="item.id" :label="item.name" :key="item.id"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }" v-if="saveInfo.realNameCheckId==1">
                <el-form-item label="显示重试按钮:" label-width="120px" prop="dictRechargeButton">
                  <el-select
                    size="small"
                    placeholder="重试按钮"
                    style="width: 100%;"
                    v-model="saveInfo.dictRechargeButton"
                  >
                    <el-option v-for="item in dictRechargeButtonOptions" :value="item.id" :label="item.name"
                               :key="item.id"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }" v-if="saveInfo.realNameCheckId==1">
                <el-form-item label="自动通过:" label-width="120px" prop="dictIsAutoPass">
                  <el-select
                    size="small"
                    placeholder="是否自动通过"
                    style="width: 100%;"
                    v-model="saveInfo.dictIsAutoPass"
                  >
                    <el-option v-for="item in dictIsAutoPassOptions" :value="item.id" :label="item.name"
                               :key="item.id"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <!--<el-row>
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                <el-form-item label="实名URL:" label-width="120px" prop="url">
                  <el-input
                    size="small"
                    v-model="saveInfo.url"
                    placeholder="请输入url"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>-->
            <el-row v-if="saveInfo.realNameCheckId==1">
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                <el-form-item label="实名项配置:" label-width="120px" prop="realnameName">
                  <el-checkbox-group v-model="config" @change="changeConfig">
                    <el-checkbox v-for="item in configList" v-model="item.value" :label="item.key" :key="item.key"
                                 @change="event=>checkBoxItemChange(event,item.key)" :disabled="item.disabled">
                      {{item.value}}
                    </el-checkbox>
                  </el-checkbox-group>
                </el-form-item>
              </el-col>
            </el-row>
            <div v-if="accountTemplateList.length>0">
              <el-row v-for="(item,index) in accountTemplateList" :key="index">
                <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                  <el-form-item :label="`${item.label}:`" label-width="120px" :prop="item.id">
                    <el-input
                      @input="reRender"
                      size="small"
                      v-model="saveInfo.accountValue[item.id]"
                      :placeholder="`请输入${item.label}`"
                    ></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </div>

            <el-row>
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                <el-form-item>
                  <el-switch
                    v-model="saveInfo.dictForceRedirtOherUrl"
                    active-value="C_YES"
                    inactive-value="C_NO"
                    active-text="如果非实名强制跳转"
                    inactive-text="关闭强制跳转">
                  </el-switch>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                <el-form-item :label="`强制跳转路径`" label-width="120px">
                  <el-input
                    :disabled="saveInfo.dictForceRedirtOherUrl=='C_NO'"
                    size="small"
                    v-model="saveInfo.forceUrl"
                    :placeholder="`请输入强制跳转路径的url`"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>


            <el-row>
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                <el-form-item>
                  <el-switch
                    v-model="saveInfo.dictIsHref"
                    active-value="C_YES"
                    inactive-value="C_NO"
                    active-text="打开其他链接"
                    inactive-text="关闭其他链接">
                  </el-switch>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                <el-form-item :label="`跳转路径`" label-width="120px">
                  <el-input
                    :disabled="saveInfo.dictIsHref=='C_NO'"
                    size="small"
                    v-model="saveInfo.hrefUrl"
                    :placeholder="`请输入跳转的url`"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :xl="{ span: 20, push: 1 }" :lg="{ span: 20, push: 1 }">
                <p>跳转路径的参数说明：</p>
                <p>{iccid}在路径上拼上当前实名卡的ICCID</p>
                <p>{cardNumber}在路径上拼上当前实名卡的卡号</p>
                <p>{upHttpsUrl}在路径上拼上带HTTPS的充值链接</p>
                <p>{upUrl}在路径上拼上不带HTTPS的充值链接</p>
                <p>{time}在路径上拼上时间戳</p>
                <p>例子：</p>
                <p>http://shiming.cctv.com?iccid={iccid}&&cno={cardNumer}&&_redir={upUrl}</p>
                <p>那么最终跳转的路径是：</p>
                <p>http://shiming.cctv.com?iccid=89869999&&cno=9999&&_redir=aaa.bbb.com/recharge</p>
              </el-col>
            </el-row>
          </el-form>
        </div>
      </div>
      <div class="sd-drawer-footer">
        <div class="buttons">
          <el-button
            @click="submitHandle('saveInfo')"
            size="small"
            type="primary"
            v-preventReClick
            style="margin-left: 10px"
          >提交
          </el-button>
        </div>
      </div>
    </el-drawer>
  </div>
</template>

<script>
import {deleteRealnameChannel, getRealnameChannelList, getTemplateOptions, saveRealnameChannel} from "@/api/getData";
import Editor from "@/components/Editor";

var qiniu = require("qiniu-js");
  var imgUrl = localStorage.getItem("image");
  export default {
    name: "StockOut",
    data() {
      return {
        config: [],
        deleteRow: {},
        // 实名类型下拉选
        dictTypeOptions: [
          // {
          //   id:'REALNAME_OFFICAL',
          //   name:'官方'
          // },
          //  {
          //   id:'REALNAME_SELF',
          //   name:'自营'
          // },
          //  {
          //   id:'REALNAME_THIRD',
          //   name:'第三方'
          // }
        ],
        // 执行顺序下拉选
        dictOrderOptions: [
          {
            id: 'PRE_RECHARGE',
            name: '充值前'
          },
          {
            id: 'AFTER_RECHARGE',
            name: '充值后'
          }
        ],
        // 自动通过下拉选
        dictIsAutoPassOptions: [
          {
            id: 'C_YES',
            name: '是'
          },
          {
            id: 'C_NO',
            name: '否'
          }
        ],
        dictRechargeButtonOptions: [
          {
            id: 'C_YES',
            name: '是'
          },
          {
            id: 'C_NO',
            name: '否'
          }
        ],
        configList: [
          {
            key: 'dictIdentityPicFront',
            value: '身份证正面',
            disabled: false
          },
          {
            key: 'dictIdentityPicBack',
            value: '身份证背面',
            disabled: false

          },
          {
            key: 'dictIdentityPicInHand',
            value: '手执身份证',
            disabled: false

          },
          {
            key: 'dictCustomerName',
            value: '客户姓名',
            disabled: false

          },
          {
            key: 'dictIdentityNumber',
            value: '身份证号码',
            disabled: false

          },
          {
            key: 'dictPhoneNumber',
            value: '客户手机号',
            disabled: false

          }
        ],
        accountTemplateList: [],
        dictIdentityPicFront: false,
        dictIdentityPicBack: false,
        dictIdentityPicInHand: false,
        dictCustomerName: false,
        dictIdentityNumber: false,
        dictPhoneNumber: false,

        configJson: {
          dictCustomerName: false,
          dictPhoneNumber: false,
          dictIdentityNumber: false,
          dictIdentityPicFront: false,
          dictIdentityPicBack: false,
          dictIdentityPicInHand: false,
        },
        // 图片上传
        upload_qiniu_addr: imgUrl,
        upload_qiniu_url: "https://upload.qbox.me",
        qiniuData: {},
        // 新增、修改-数据对象
        saveInfo: {
          realnameName: '',
          realNameCheckId: "",
          url: "",
          config: "",
          dictOrder: "",
          dictRechargeButton: "",
          dictIsAutoPass: "",
          accountValue: {},
          dictIsHref: "C_NO",
          hrefUrl: '',
          dictForceRedirtOherUrl:"C_NO",
          forceUrl:'',
          dictDisplayCheck:'C_YES'
        },
        // 抽屉
        noticeTitle: "",
        drawer: false,
        direction: "ttb",

        formData: {
          id: null,
          title: null,
          contentText: null,
          sendNumber: null,
          expirationDate: null,
          dictNoticeType: null
        },
        // ----↓修改公告
        submitLoading: false,
        showEdit: false,
        deleteNoticeVisible: false,
        buttonRetryLoading: false,
        startDate: [],
        endDate: [],
        // 查询条件
        searchForm: {
          realnameName: "", //实名通道名称
          realNameCheckId: "",       // 实名模板
          dictOrder: "",      // 执行顺序
          dictIsAutoPass: "", // 是否自动通过
        },
        // loading...
        loading: false,
        searchLoading: false,
        mainTableLoading: false,
        // 分页
        page: {
          current: 1,
          size: 10,
          total: 0,
          ascs: [],
          descs: []
        },
        //
        tablePage: {
          pageSize: 15,
          pageSizes: [5, 15, 20, 50, 100, 200, 500, 1000]
        },
        tableData: [],
        value: false,
        tableLoading: false,
        id: "",
        okloading: false,
        pickerOptions: {
          shortcuts: [
            {
              text: "最近一周",
              onClick(picker) {
                const end = new Date();
                const start = new Date();
                start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                picker.$emit("pick", [start, end]);
              }
            },
            {
              text: "最近一个月",
              onClick(picker) {
                const end = new Date();
                const start = new Date();
                start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                picker.$emit("pick", [start, end]);
              }
            },
            {
              text: "最近三个月",
              onClick(picker) {
                const end = new Date();
                const start = new Date();
                start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                picker.$emit("pick", [start, end]);
              }
            }
          ]
        },
        formRules: {
          headName: [{required: true, message: "请输入套餐组名称", trigger: "blur"}],
        },
        pagekey: '',
      };
    },
    components: {
      Editor
    },
    watch: {
      user: function (val, oldval) {
        this.form.belongId = val.value;
        this.form.username = val.label;
      }
    },
    created() {

      // 读取session里的查询参数
      let searchObj = sessionStorage.getItem(this.$route.path);
      // console.log(searchObj)
      if (searchObj != undefined && searchObj != null && searchObj != "") {
        this.searchForm = JSON.parse(searchObj);
        this.page = this.searchForm.page;
      }
      this.getTemplateOptionsData()

    },

    methods: {
      //获取pageKey
      async getPageKey() {
        this.pagekey = await this.$getPageKey();
      },
      // 新增
      addNewNotice() {
        this.accountTemplateList = []
        this.noticeTitle = "新增实名通道";
        this.saveInfo = {
          realnameName: '',
          realNameCheckId: "",
          url: "",
          config: "",
          dictOrder: "",
          dictRechargeButton: "",
          dictIsAutoPass: "",
          accountValue: {}
        };
        this.config = []
        this.drawer = true;
        this.getPageKey();
      },
      // 选中数组转json
      configArr2Json(arr) {

        this.configJson = {
          dictCustomerName: false,
          dictPhoneNumber: false,
          dictIdentityNumber: false,
          dictIdentityPicFront: false,
          dictIdentityPicBack: false,
          dictIdentityPicInHand: false,
        }
        arr.map(item => {
          if (item == "dictIdentityPicFront") {
            this.configJson["dictCustomerName"] = true
            this.configJson["dictIdentityNumber"] = true
            this.dictCustomerName = "checked"
            this.dictIdentityNumber = "checked"
          }
          this.configJson[item] = true
        })
        this.saveInfo.config = JSON.stringify(this.configJson)
      },
      // 选中json转数组
      configJson2Arr(json) {
        let arr = []
        for (var key in json) {
          if (json[key] === true) {
            arr.push(`${key}`)
          }
        }
        this.config = arr
      },
      // 编辑
      editEvent(row) {

        this.getPageKey();
        let accountValue = JSON.parse(row.accountValue)
        this.noticeTitle = "编辑实名通道";
        this.config = []
        if(row.config!==''){
          let configJson = JSON.parse(row.config)
          this.configJson2Arr(configJson)
        }

        this.saveInfo = {
          id: row.id,
          realnameName: row.realnameName,
          realNameCheckId: row.realNameCheckId,
          url: row.url,
          dictOrder: row.dictOrder,
          dictRechargeButton: row.dictRechargeButton,
          dictIsAutoPass: row.dictIsAutoPass,
          accountValue: {},
          dictIsHref: row.dictIsHref,
          hrefUrl: row.hrefUrl,
          dictForceRedirtOherUrl: row.dictForceRedirtOherUrl,
          forceUrl: row.forceUrl,
          dictDisplayCheck: row.dictDisplayCheck
        };
        this.selectAccountTemplate(row.realNameCheckId)
        this.saveInfo.accountValue = accountValue
        this.config.map(i => {
          if (i === "dictIdentityPicFront") {
            this.configList[3].disabled = true
            this.configList[4].disabled = true
          }
        })

        this.drawer = true;
        // this.showEdit = true
      },
      // 保存-校验
      submitHandle(formName) {
        // console.log(this.saveInfo);
        // this.okloading = true;
        this.$refs[formName].validate(valid => {
          if (valid) {
            this.saveNewNoticeFunc();
          } else {
            return false;
          }
        });
      },
      // 保存-接口
      async saveNewNoticeFunc() {

        let saveInfo = Object.assign({}, this.saveInfo)
        saveInfo.accountValue = JSON.stringify(this.saveInfo.accountValue);

        const returnData = await saveRealnameChannel(saveInfo, {pagekey: this.pagekey});
        if (returnData._result) {
          this.$message.success("提交成功");
          this.initData();
          this.drawer = false;
        }
      },

      // 删除
      deleteNoticeConfirm(row) {
        // console.log(row);
        this.deleteRow = row
        this.deleteNoticeVisible = true;
      },
      // 删除-接口
      async deleteNoticeFunc() {
        const returnData = await deleteRealnameChannel({
          id: this.deleteRow.id
        });
        if (returnData._result) {
          this.$message.success("提交成功");
          this.deleteNoticeVisible = false;
          this.initData();
        }
      },
      handleCurrentChange(currentPage) {
        this.page.current = currentPage;
        this.initData();
      },
      handleSizeChange(pageSize) {
        this.page.current = 1;
        this.page.size = pageSize;
        this.initData();
      },
      beforeinitData() {
        this.page.current = 1
        this.initData()
      },
      // 初始化-列表
      async initData(theKey) {
        this.mainTableLoading = true;
        this.searchForm.page = this.page;
        // 保存查询参数到session
        sessionStorage.setItem(this.$route.path, JSON.stringify(this.searchForm));
        const returnData = await getRealnameChannelList(this.searchForm, {
          obj: this,
          key: "tableLoading;" + theKey
        });
        this.tableData = [];
        if (returnData._result) {
          // 数据回显
          returnData.data.records.map(item => {
            const data = {};
            data.id = item.id;
            data.oemId = item.oemId;
            data.realNameCheckId = item.realNameCheckId;
            this.dictTypeOptions.map(i => {
              if (i.id === item.realNameCheckId) {
                data.dictTypeName = i.checkName;
              }
            })
            data.url = item.url;
            data.config = item.config;
            data.dictOrder = item.dictOrder;
            data.dictOrderName = item.dictOrderName;
            data.dictRechargeButton = item.dictRechargeButton;
            data.dictRechargeButtonName = item.dictRechargeButtonName;
            data.dictForceRedirtOherUrl = item.dictForceRedirtOherUrl;
            data.forceUrl = item.forceUrl;
            data.dictIsAutoPass = item.dictIsAutoPass;
            data.dictIsAutoPassName = item.dictIsAutoPassName;
            data.realnameName = item.realnameName;
            data.dictIsAutoPass = item.dictIsAutoPass;
            data.accountValue = item.accountValue
            data.dictIsHref = item.dictIsHref
            data.hrefUrl = item.hrefUrl
            data.dictDisplayCheck = item.dictDisplayCheck
            data.dictDisplayCheckName = item.dictDisplayCheckName
            // data.fieldOne = item.fieldOne
            // data.fieldTwo = item.fieldTwo
            // data.fieldThree = item.fieldThree
            // data.fieldFour = item.fieldFour

            this.tableData.push(data);
          });
          this.tableLoading = false;
          this.page.total = returnData.data.total;
        }
        this.mainTableLoading = false;
      },
      // 重置-查询条件
      resetForm(formName) {
        // this.$refs[formName].resetFields();
        this.startDate = "";
        this.endDate = "";
        this.searchForm = {
          realNameCheckId: "",       // 实名模板
          dictOrder: "",      // 执行顺序
          dictIsAutoPass: "", // 是否自动通过
        };
      },
      // 实名模板下拉选
      async getTemplateOptionsData() {
        this.mainTableLoading = true;
        const returnData = await getTemplateOptions({});
        if (returnData._result) {
          this.dictTypeOptions = returnData.data
          this.initData();
        }
      },
      selectAccountTemplate(e) {
        this.accountTemplateList = []
        let template
        let item

        if (this.dictTypeOptions.length > 0) {
          this.dictTypeOptions.map((i, index) => {
            if (e === i.id)
              template = JSON.parse(this.dictTypeOptions[index].accountTemplate)
          })
        }

        for (const key in template) {
          if (template.hasOwnProperty(key)) {
            let data = {}
            data.id = key, data.label = template[key]
            // 初始化saveInfo.accountValue
            this.saveInfo.accountValue[key] = ''
            this.accountTemplateList.push(data)
          }
        }
      },
      changeConfig(e) {
        if (true) {

        }
        this.configArr2Json(this.config)
      },
      checkBoxItemChange(e, key) {
        if (e && key === 'dictIdentityPicFront') {
          this.config.push('dictCustomerName')
          this.config.push('dictIdentityNumber')
          this.configList[3].disabled = true
          this.configList[4].disabled = true

        } else if (!e && key === 'dictIdentityPicFront') {

          for (let index = this.config.length - 1; index >= 0; index--) {
            const item = this.config[index];
            // console.log(item)
            // console.log(index)
            if (item === 'dictIdentityNumber' || item === 'dictCustomerName') {
              // console.log(item)
              // console.log(index)
              this.config.splice(index, 1)
            }

          }
          this.configList[3].disabled = false
          this.configList[4].disabled = false
        }
      },
      reRender() {
        this.$forceUpdate()
      }
    }
  };
</script>
<style scoped lang="scss">
  .el-popper[x-placement^=bottom] {
    margin-right: -31px;
    box-shadow: 0px 0px 10px #888888;
    margin-left: 6px;

    .operation {
      border: 0;
      outline: none;
      display: block;
      text-align: center;
      margin: 0;
    }
  }

  .el-popper[x-placement^=top] {
    box-shadow: 0px 0px 10px #888888;
    margin-left: 6px;
    margin-right: -31px;

    button {
      display: block;
    }

    .operation {
      border: 0;
      outline: none;
      display: block;
      text-align: center;
      margin: 0;
    }
  }

  .el-container {
    flex-direction: column；
  }

  .drawer_form {
    padding: 50px;
    overflow-y: auto;

    .custom_drawer_content {
      width: 100%;
    }
  }

  /deep/ .el-drawer.ttb {
    width: 500px;
    left: 50%;
    margin-left: -250px;
    /* right:50%; */
  }

  // .notice_drawer_form {
  //   width: 100%;
  // }
  .recentAdd li {
    list-style: none;
    float: left;
    margin-right: 5px;
    line-height: 15px;
  }
</style>
<style>
  .el-drawer.ttb {
    width: 800px;
    left: 50%;
    margin-left: -400px;
    /* right:50%; */
  }
</style>
